/// <reference path="../../../../../typings/angularjs/angular.d.ts"/>
/* global is */
/**
 * Created by xinhuang on 15/6/9.
 */
(function () {
  'use strict';

  angular.module('directives.customActivity.realtime', [
    'services.customActivity.realtime'
  ])
    .directive('busDayVol', busDayVol)
    .directive('busTotalVol', busTotalVol)
    .directive('busTimeVol', busTimeVol)
    .directive('userRechargePrefer', userRechargePrefer)
    .directive('busProVol', busProVol)
    .directive('provinceSuccessrate', provinceSuccessrate)
    .directive('processTime', processTime)
    .directive('throughput', throughput)
    .directive('tps', tps)
    .directive('upaySuccessrate', upaySuccessrate)
    .directive('provinceBusSuccessrate', provinceBusSuccessrate)
    .directive('provinceSysSuccessrate', provinceSysSuccessrate)
    .directive('allBusSuccessrate', allBusSuccessrate)
    .directive('allSysSuccessrate', allSysSuccessrate)
    .directive('upayHealth', upayHealth);

  function busDayVol(realtimeServer, timedTask, MODULES_ID) {
    return {
      restrict: 'E',
      scope: {
        selectedModules: '='
      },
      replace: true,
      template: '<div module-name="bus-day-vol" layoutdom="1" draggable="true" class="model">' +
      '<label  class="title title-color2">当日累计业务量</label>' +
      '<div class="center">' +
      '<table class="toptable">' +
      '<tr ng-if="showUpay"><td>统一支付</td><td>{{businessDayVolume.data.upay}}</td></tr>' +
      '<tr ng-if="showTmall"><td>天猫旗舰店</td><td>{{businessDayVolume.data.tmall}}</td></tr>' +
      '<tr ng-if="showScpay"><td>移动商城</td><td>{{businessDayVolume.data.scpay}}</td></tr>' +
      '<tr ng-if="showBank"><td>银行总对总</td><td>{{businessDayVolume.data.bank}}</td></tr>' +
      '<tr ng-if="showVces"><td>有价卡</td><td>{{businessDayVolume.data.vces}}</td></tr>' +
      '<tr ng-if="showLingxi"><td>灵犀语音</td><td>{{businessDayVolume.data.lingxi}}</td></tr>' +
      '</table>' +
      '<core-loading ng-hide="coreLoading"></core-loading>' +
      '</div>' +
      '</div>',
      link: linkFn
    };

    function linkFn(scope) {

      scope.showUpay = scope.selectedModules.indexOf(MODULES_ID.BUS_DAY_VOL.UPAY) !== -1;
      scope.showTmall = scope.selectedModules.indexOf(MODULES_ID.BUS_DAY_VOL.TMALL) !== -1;
      scope.showScpay = scope.selectedModules.indexOf(MODULES_ID.BUS_DAY_VOL.SCPAY) !== -1;
      scope.showBank = scope.selectedModules.indexOf(MODULES_ID.BUS_DAY_VOL.BANK) !== -1;
      scope.showVces = scope.selectedModules.indexOf(MODULES_ID.BUS_DAY_VOL.VCES) !== -1;
      scope.showLingxi = scope.selectedModules.indexOf(MODULES_ID.BUS_DAY_VOL.LINGXI) !== -1;

      scope.businessDayVolume = realtimeServer.businessDayVolume;

      realtimeServer.businessDayVolume.get(function () {
        scope.coreLoading = true;
      });

      timedTask.register('businessDayVolume');
    }
  }

  function busTotalVol(realtimeServer, timedTask, MODULES_ID) {
    return {
      restrict: 'E',
      scope: {
        selectedModules: '='
      },
      replace: true,
      template: '<div module-name="bus-total-vol" layoutdom="1" draggable="true" class="model"> ' +
      '<label class="title title-color2">活动期间累计业务量</label> ' +
      '<div class="center"> ' +
      '<table class="toptable"> ' +
      '<tr ng-if="showUpay"><td>统一支付</td><td>{{businessTotalVolume.data.upay}}</td></tr>' +
      '<tr ng-if="showTmall"><td>天猫旗舰店</td><td>{{businessTotalVolume.data.tmall}}</td></tr>' +
      '<tr ng-if="showScpay"><td>移动商城</td><td>{{businessTotalVolume.data.scpay}}</td></tr> ' +
      '<tr ng-if="showBank"><td>银行总对总</td><td>{{businessTotalVolume.data.bank}}</td></tr>' +
      '<tr ng-if="showVces"><td>有价卡</td><td>{{businessTotalVolume.data.vces}}</td></tr>' +
      '<tr ng-if="showLingxi"><td>灵犀语音</td><td>{{businessTotalVolume.data.lingxi}}</td></tr>' +
      '</table>' +
      '<core-loading ng-hide="coreLoading"></core-loading>' +
      '</div>' +
      '</div>',
      link: linkFn
    };

    function linkFn(scope) {
      scope.showUpay = scope.selectedModules.indexOf(MODULES_ID.BUS_TOTAL_VOL.UPAY) !== -1;
      scope.showTmall = scope.selectedModules.indexOf(MODULES_ID.BUS_TOTAL_VOL.TMALL) !== -1;
      scope.showScpay = scope.selectedModules.indexOf(MODULES_ID.BUS_TOTAL_VOL.SCPAY) !== -1;
      scope.showBank = scope.selectedModules.indexOf(MODULES_ID.BUS_TOTAL_VOL.BANK) !== -1;
      scope.showVces = scope.selectedModules.indexOf(MODULES_ID.BUS_TOTAL_VOL.VCES) !== -1;
      scope.showLingxi = scope.selectedModules.indexOf(MODULES_ID.BUS_TOTAL_VOL.LINGXI) !== -1;

      scope.businessTotalVolume = realtimeServer.businessTotalVolume;

      realtimeServer.businessTotalVolume.get(function () {
        scope.coreLoading = true;
      });

      timedTask.register('businessTotalVolume');
    }
  }

  function busTimeVol(realtimeServer, chartService,timedTask, MODULES_ID) {
    return {
      restrict: 'E',
      scope: {
        selectedModules: '='
      },
      replace: true,
      template: '<div module-name="bus-time-vol" layoutdom="2" draggable="true" class="model model2">' +
      '<label  class="title title-color2">分时刻业务量</label>' +
      '<div class="center">' +
      '<slider panels="panels" div-style="height:180px"></slider>' +
      '<core-loading ng-hide="coreLoading"></core-loading>' +
      '</div>' +
      '</div>',
      link: linkFn
    };

    function linkFn(scope) {
      scope.panels = [];
      angular.forEach(MODULES_ID.BUS_TIME_VOL, function (id, key) {
        if (scope.selectedModules.indexOf(id) !== -1) {
          scope.panels.push(key.toLowerCase() + 'BusTimeVol');
        }
      });
      scope.businessTimeVolume = realtimeServer.businessTimeVolume;
      //初始化数据
      realtimeServer.businessTimeVolume.get(function (res) {

        angular.forEach(scope.businessTimeVolume.data, function (data, busLine) {
          if (scope.panels.indexOf(busLine + 'BusTimeVol') === -1) {
            return;
          }
          chartService.busTimeVol.init(
            document.getElementById(busLine + 'BusTimeVol'),
            busLine,
            {xAxis: data.volumeTime, data: [data.volumeOfBus, data.trancAmount]},
            res.state
          );

          scope.coreLoading = true;
        });

        scope.$watch('businessTimeVolume', function (newValue, oldValue) {
          if (newValue === oldValue) {
            return;
          }
          angular.forEach(newValue.data, function (data, busLine) {
            if (scope.panels.indexOf(busLine + 'BusTimeVol') === -1) {
              return;
            }
            var state = is.array(data.volumeTime) ? '1005' : '';
            chartService.busTimeVol.update(busLine, {
              xAxis: data.volumeTime,
              data: [data.volumeOfBus, data.trancAmount]
            }, state);
          });
        }, true);
      });

      timedTask.register('businessTimeVolume');
    }
  }

  function userRechargePrefer(realtimeServer, chartService, timedTask,  MODULES_ID) {
    return {
      restrict: 'E',
      scope: {
        selectedModules: '='
      },
      template: '<div module-name="user-recharge-prefer" layoutdom="2" draggable="true" class="model model2">' +
      '<label  class="title title-color2">当日用户充值偏好</label>' +
      '<div class="center">' +
      '<slider panels="panels" div-style="height:180px;"></slider>' +
      '<core-loading ng-hide="coreLoading"></core-loading>' +
      '</div>' +
      '</div>',
      replace: true,
      link: linkFn
    };

    function linkFn(scope) {
      scope.panels = [];
      angular.forEach(MODULES_ID.USER_RECHARGE_PREFER, function (id, key) {
        if (scope.selectedModules.indexOf(id) !== -1) {
          scope.panels.push(key.toLowerCase() + 'UserRechargePrefer');
        }
      });

      scope.userRechargePrefer = realtimeServer.userRechargePreference;

      realtimeServer.userRechargePreference.get(function () {

        angular.forEach(scope.userRechargePrefer.data, function (data, busLine) {
          if (scope.panels.indexOf(busLine + 'UserRechargePrefer') === -1) {
            return;
          }
          chartService.userRechargePrefer.init(
            document.getElementById(busLine + 'UserRechargePrefer'),
            busLine,
            {yAxis: data.rechargeAmount, data: data.volumeOfTrans, flag: data.flag[0]}
          );

          scope.coreLoading = true;
        });

        scope.$watch('userRechargePrefer', function (newValue, oldValue) {
          if (newValue === oldValue) {
            return;
          }
          angular.forEach(newValue.data, function (data, busLine) {
            if (scope.panels.indexOf(busLine + 'UserRechargePrefer') === -1) {
              return;
            }
            chartService.userRechargePrefer.update(busLine, data.volumeOfTrans);
          });
        }, true);
      });

      timedTask.register('userRechargePreference');
    }
  }

  function busProVol(realtimeServer, chartService, timedTask) {
    return {
      restrict: 'E',
      scope: {},
      template: '<div module-name="bus-pro-vol" layoutdom="2" draggable="true" class="model">' +
      '<label  class="title title-color2">分省业务量</label>' +
      '<div class="center">' +
      '<table class="maptable">' +
      '<tr><td><span></span>最高</td><td ng-repeat="max in range.max"><div>{{max.provinceName}}<span ng-hide="max.provinceName === \'--\'">{{max.volume}}</span></div></td></tr>' +
      '<tr><td><span></span>最低</td><td ng-repeat="min in range.min"><div>{{min.provinceName}}<span ng-hide="min.provinceName === \'--\'">{{min.volume}}</span></div></td></tr>' +
      '</table>' +
      '<div class="body-map">' +
      '<div id="busProVol" style="height: 311px; width: 100%;"></div>' +
      '</div>' +
      '<core-loading ng-hide="coreLoading"></core-loading>' +
      '</div>' +
      '</div>',
      replace: true,
      link: linkFn
    };

    function linkFn(scope) {
      scope.businessProvinceVolume = realtimeServer.businessProvinceVolume;
      scope.range = {
        max: [],
        min: []
      };

      realtimeServer.businessProvinceVolume.get(function () {
        scope.range.max = [];
        scope.range.min = [];

        var copy = angular.copy(scope.businessProvinceVolume.data);
        var len = 6;
        var _temp;

        for (var iterator = 0; iterator < len; iterator++) {
          if (is.even(iterator)) {
            _temp = copy.shift();
            if (is.undefined(_temp)) {
              _temp = {provinceName: '--'};
            }
            scope.range.max.push(_temp);
          } else {
            _temp = copy.pop();
            if (is.undefined(_temp)) {
              _temp = {provinceName: '--'};
            }
            scope.range.min.push(_temp);
          }
        }

        chartService.province.init(
          document.getElementById('busProVol'),
          'busProVol',
          scope.businessProvinceVolume.data
        );

        scope.coreLoading = true;
      });

      scope.$watch('businessProvinceVolume.data', function (newValue, oldValue) {
        if (newValue === oldValue) {
          return;
        }
        scope.range.max = [];
        scope.range.min = [];

        var copy = angular.copy(newValue);
        var len = 6;
        var _temp;

        for (var iterator = 0; iterator < len; iterator++) {
          if (is.even(iterator)) {
            _temp = copy.shift();
            if (is.undefined(_temp)) {
              _temp = {provinceName: '--'};
            }
            scope.range.max.push(_temp);
          } else {
            _temp = copy.pop();
            if (is.undefined(_temp)) {
              _temp = {provinceName: '--'};
            }
            scope.range.min.push(_temp);
          }
        }
        chartService.province.init(
          document.getElementById('busProVol'),
          'busProVol',
          newValue
        );
      }, true);

      timedTask.register('businessProvinceVolume');
    }
  }

  function provinceSuccessrate(realtimeServer, chartService, timedTask) {
    return {
      restrict: 'E',
      scope: {},
      template: '<div module-name="province-successrate" layoutdom="2" draggable="true" class="model">' +
      '<label  class="title title-color2">分省全业务流程业务处理成功率</label>' +
      '<div class="center">' +
      '<table class="maptable">' +
      '<tr><td><span></span>最高</td><td ng-repeat="max in range.max"><div>{{max.provinceName}}<span ng-hide="max.provinceName === \'--\'">{{max.rate}}</span></div></td></tr>' +
      '<tr><td><span></span>最低</td><td ng-repeat="min in range.min"><div>{{min.provinceName}}<span ng-hide="min.provinceName === \'--\'">{{min.rate}}</span></div></td></tr>' +
      '</table>' +
      '<div class="body-map">' +
      '<div id="provinceSuccessrate" style="height: 311px; width: 100%;"></div>' +
      '</div>' +
      '<core-loading ng-hide="coreLoading"></core-loading>' +
      '</div>' +
      '</div>',
      replace: true,
      link: linkFn
    };

    function linkFn(scope) {
      scope.provinceSuccessrate = realtimeServer.provinceAllBusinessProcess;
      scope.range = {
        max: [],
        min: []
      };

      realtimeServer.provinceAllBusinessProcess.get(function () {
        scope.range.max = [];
        scope.range.min = [];

        var copy = angular.copy(scope.provinceSuccessrate.data)
          .filter(function(a){
          if(a.totalVolume !== 0){
            return true;
          }
        }).map(function(item){
            item.rate = item.rate.toFixed(2) + '%';
            return item;
        });
        var len = 6;
        var _temp;

        for (var iterator = 0; iterator < len; iterator++) {
          if (is.even(iterator)) {
            _temp = copy.shift();
            if (is.undefined(_temp)) {
              _temp = {provinceName: '--', rate: ''};
            }
            scope.range.max.push(_temp);
          } else {
            _temp = copy.pop();
            if (is.undefined(_temp)) {
              _temp = {provinceName: '--', rate: ''};
            }
            scope.range.min.push(_temp);
          }
        }

        chartService.province.init(
          document.getElementById('provinceSuccessrate'),
          'provinceSuccessrate',
          scope.provinceSuccessrate.data
        );

        scope.coreLoading = true;
      });

      scope.$watch('provinceSuccessrate.data', function (newValue, oldValue) {
        if (newValue === oldValue) {
          return;
        }
        scope.range.max = [];
        scope.range.min = [];

        var copy = angular.copy(newValue)
          .filter(function(a){
          if(a.totalVolume !== 0){
            return true;
          }
        }).map(function(item){
            item.rate = item.rate.toFixed(2) + '%';
            return item;
          });
        var len = 6;
        var _temp;

        for (var iterator = 0; iterator < len; iterator++) {
          if (is.even(iterator)) {
            _temp = copy.shift();
            if (is.undefined(_temp)) {
              _temp = {provinceName: '--', rate: ''};
            }
            scope.range.max.push(_temp);
          } else {
            _temp = copy.pop();
            if (is.undefined(_temp)) {
              _temp = {provinceName: '--', rate: ''};
            }
            scope.range.min.push(_temp);
          }
        }

        chartService.province.init(
          document.getElementById('provinceSuccessrate'),
          'provinceSuccessrate',
          newValue
        );
      }, true);

      timedTask.register('provinceAllBusinessProcess');
    }
  }

  function processTime(realtimeServer, MODULES_ID, timedTask, BUSINESS_LINE_NAME, $compile) {
    return {
      restrict: 'E',
      scope: {
        selectedModules: '='
      },
      replace: true,
      template: '<div module-name="process-time" layoutdom="1" draggable="true" class="model">' +
      '<label  class="title title-color2">处理耗时</label>' +
      '<div class="center">' +
      '<slider panels="panels"></slider>' +
      '<core-loading ng-hide="coreLoading"></core-loading>' +
      '</div>' +
      '</div>',
      link: linkFn
    };

    function linkFn(scope) {
      scope.processTime = realtimeServer.averageProcessTime;
      scope.panels = [];

      angular.forEach(scope.selectedModules, function (id) {
        switch (id) {
          case MODULES_ID.PROCESS_TIME.UPAY:
            scope.panels.push('processTime');
            break;
          case MODULES_ID.PROCESS_TIME.TMALL:
            scope.panels.push('tmProcessTime');
            break;
          case MODULES_ID.PROCESS_TIME.SCPAY:
            scope.panels.push('cmProcessTime');
            break;
          case MODULES_ID.PROCESS_TIME.BANK:
            scope.panels.push('bkProcessTime');
            break;
          case MODULES_ID.PROCESS_TIME.VCES:
            scope.panels.push('vcesProcessTime');
            break;
          case MODULES_ID.PROCESS_TIME.LINGXI:
            scope.panels.push('lingxiProcessTime');
            break;
        }
      });

      realtimeServer.averageProcessTime.get(function () {
        //初始化slider内部元素
        angular.forEach(scope.panels, function (busLine) {
          var element, busLineName, html;
          element = angular.element(document.getElementById(busLine));
          if (element.find('div').length === 0) {
            busLineName = '';
            switch (busLine) {
              case 'processTime':
                busLineName = BUSINESS_LINE_NAME.UPAY;
                break;
              case 'tmProcessTime':
                busLineName = BUSINESS_LINE_NAME.TMALL;
                break;
              case 'cmProcessTime':
                busLineName = BUSINESS_LINE_NAME.SCPAY;
                break;
              case 'bkProcessTime':
                busLineName = BUSINESS_LINE_NAME.BANK;
                break;
              case 'vcesProcessTime':
                busLineName = BUSINESS_LINE_NAME.VCES;
                break;
              case 'lingxiProcessTime':
                busLineName = BUSINESS_LINE_NAME.LINGXI;
                break;
            }
            //可以让插入的HTML绑定到外层Scope
            html =
              $compile(
                '<div class="mypiechart purple"><div>{{processTime.data[\'' + busLine + '\']}}</div><div>秒</div></div><div>' + busLineName + '</div>'
              )(scope);

            element.append(html);
          }
          scope.coreLoading = true;
        });
      });

      timedTask.register('averageProcessTime');
    }
  }

  function throughput(realtimeServer, MODULES_ID, timedTask, BUSINESS_LINE_NAME, $compile) {
    return {
      restrict: 'E',
      scope: {
        selectedModules: '='
      },
      replace: true,
      template: '<div module-name="throughput" layoutdom="1" draggable="true" class="model">' +
      '<label  class="title title-color2">并发数</label>' +
      '<div class="center">' +
      '<slider panels="panels"></slider>' +
      '<core-loading ng-hide="coreLoading"></core-loading>' +
      '</div>' +
      '</div>',
      link: linkFn
    };

    function linkFn(scope) {
      scope.throughput = realtimeServer.maxThroughput;
      scope.panels = [];

      angular.forEach(scope.selectedModules, function (id) {
        switch (id) {
          case MODULES_ID.THROUGHPUT.UPAY:
            scope.panels.push('throughput');
            break;
          case MODULES_ID.THROUGHPUT.TMALL:
            scope.panels.push('tmThroughput');
            break;
          case MODULES_ID.THROUGHPUT.SCPAY:
            scope.panels.push('cmThroughput');
            break;
          case MODULES_ID.THROUGHPUT.BANK:
            scope.panels.push('bkThroughput');
            break;
          case MODULES_ID.THROUGHPUT.VCES:
            scope.panels.push('vcesThroughput');
            break;
          case MODULES_ID.THROUGHPUT.LINGXI:
            scope.panels.push('lingxiThroughput');
            break;
        }
      });

      realtimeServer.maxThroughput.get(function () {
        //初始化内部元素
        angular.forEach(scope.panels, function (busLine) {
          var element, busLineName, html;
          element = angular.element(document.getElementById(busLine));
          if (element.find('div').length === 0) {
            busLineName = '';
            switch (busLine) {
              case 'throughput':
                busLineName = BUSINESS_LINE_NAME.UPAY;
                break;
              case 'tmThroughput':
                busLineName = BUSINESS_LINE_NAME.TMALL;
                break;
              case 'cmThroughput':
                busLineName = BUSINESS_LINE_NAME.SCPAY;
                break;
              case 'vcesThroughput':
                busLineName = BUSINESS_LINE_NAME.VCES;
                break;
              case 'lingxiThroughput':
                busLineName = BUSINESS_LINE_NAME.LINGXI;
                break;
            }
            //可以让插入的HTML绑定到外层Scope
            html =
              $compile(
                '<div class="mypiechart deepblue"><div>{{throughput.data[\'' + busLine + '\']}}</div><div>个</div></div><div>' + busLineName + '</div>'
              )(scope);

            element.append(html);
          }
          scope.coreLoading = true;
        });
      });

      timedTask.register('maxThroughput');
    }
  }

  function tps(realtimeServer, MODULES_ID, timedTask, BUSINESS_LINE_NAME, $compile) {
    return {
      restrict: 'E',
      scope: {
        selectedModules: '='
      },
      replace: true,
      template: '<div module-name="tps" layoutdom="1" draggable="true" class="model">' +
      '<label  class="title title-color2">吞吐量</label>' +
      '<div class="center">' +
      '<slider panels="panels"></slider>' +
      '<core-loading ng-hide="coreLoading"></core-loading>' +
      '</div>' +
      '</div>',
      link: linkFn
    };

    function linkFn(scope) {
      scope.TPS = realtimeServer.maxTPS;
      scope.panels = [];

      angular.forEach(scope.selectedModules, function (id) {
        switch (id) {
          case MODULES_ID.TPS.UPAY:
            scope.panels.push('tps');
            break;
          case MODULES_ID.TPS.TMALL:
            scope.panels.push('tmTps');
            break;
          case MODULES_ID.TPS.SCPAY:
            scope.panels.push('cmTps');
            break;
          case MODULES_ID.TPS.BANK:
            scope.panels.push('bkTps');
            break;
          case MODULES_ID.TPS.VCES:
            scope.panels.push('vcesTps');
            break;
          case MODULES_ID.TPS.LINGXI:
            scope.panels.push('lingxiTps');
            break;
        }
      });

      realtimeServer.maxTPS.get(function () {
        //初始化内部元素
        angular.forEach(scope.panels, function (busLine) {

          var element, busLineName, html;
          element = angular.element(document.getElementById(busLine));
          if (element.find('div').length === 0) {
            busLineName = '';
            switch (busLine) {
              case 'tps':
                busLineName = BUSINESS_LINE_NAME.UPAY;
                break;
              case 'tmTps':
                busLineName = BUSINESS_LINE_NAME.TMALL;
                break;
              case 'cmTps':
                busLineName = BUSINESS_LINE_NAME.SCPAY;
                break;
              case 'bkTps':
                busLineName = BUSINESS_LINE_NAME.BANK;
                break;
              case 'vcesTps':
                busLineName = BUSINESS_LINE_NAME.VCES;
                break;
              case 'lingxiTps':
                busLineName = BUSINESS_LINE_NAME.LINGXI;
                break;
            }
            //可以让插入的HTML绑定到外层Scope
            html =
              $compile(
                '<div class="mypiechart blue"><div>{{TPS.data[\'' + busLine + '\']}}</div><div>tps</div></div><div>' + busLineName + '</div>'
              )(scope);

            element.append(html);
          }
          scope.coreLoading = true;
        });
      });

      timedTask.register('maxTPS');
    }
  }

  function upaySuccessrate(realtimeServer, timedTask, MODULES_ID, $compile) {
    return {
      restrict: 'E',
      replace: true,
      scope: {
        selectedModules: '='
      },
      template: '<div module-name="upay-successrate" layoutdom="1" draggable="true" class="model">' +
      '<label  class="title title-color2">统一支付</label>' +
      '<div class="center">' +
      '<slider panels="panels"><slider/>' +
      '</div>' +
      '<core-loading ng-hide="coreLoading"></core-loading>' +
      '</div>',
      link: linkFn
    };

    function linkFn(scope) {
      scope.panels = [];
      angular.forEach(scope.selectedModules, function (id) {
        switch (id) {
          case MODULES_ID.UPAY_SUCCESSRATE.BUS_PROCESS:
            scope.panels.push('businessProcess');
            break;
          case MODULES_ID.UPAY_SUCCESSRATE.SYS_PROCESS:
            scope.panels.push('systemProcess');
            break;
        }
      });

      scope.upaySuccessrate = realtimeServer.upaySuccessRate;
      scope.warn = {};

      realtimeServer.upaySuccessRate.get(function () {
        angular.forEach(scope.upaySuccessrate.data, function (rate, name) {
          if (scope.panels.indexOf(name) === -1) {
            return;
          }
          scope.warn[name] = {
            bgColor: rate.rateState == 1 ? '#f44336' : '#2196f3',
            fontColor: rate.rate < 95 ? '#333' : '#fff'
          };
          var title;
          var ele = angular.element(document.getElementById(name));
          if (ele.find('canvas').length === 0) {
            switch (name) {
              case 'businessProcess':
                title = '业务处理成功率';
                break;
              case 'systemProcess':
                title = '系统处理成功率';
                break;
            }
            var html = $compile(
              '<aquarius fontcolor="warn[\'' + name + '\'].fontColor" scolor="warn[\'' + name + '\'].bgColor" percentage="upaySuccessrate.data[\'' + name + '\'].rate" text="upaySuccessrate.data[\'' + name + '\'].rate + \'%\'" width="100" height="100" style="border: 5px solid #DCDBDB;border-radius: 100px;"></aquarius><div>' + title + '</div>'
            )(scope);

            ele.append(html);
          }
          scope.coreLoading = true;
        });
      });

      scope.$watch('upaySuccessrate.data', function(newValue, oldValue){
        if(newValue === oldValue){
          return;
        }

        angular.forEach(newValue, function(rate, name){
          if(scope.warn[name]){
            scope.warn[name].bgColor = rate.rateState == 1 ? '#f44336' : '#2196f3';
            scope.warn[name].fontColor = rate.rate < 97 ? '#333' : '#fff';
          }
        });
      }, true);

      timedTask.register('upaySuccessRate');
    }
  }

  function provinceBusSuccessrate(realtimeServer, MODULES_ID, timedTask, $compile, BUSINESS_LINE_NAME) {
    return {
      restrict: 'E',
      replace: true,
      scope: {
        selectedModules: '='
      },
      template: '<div module-name="province-bus-successrate" layoutdom="1" draggable="true" class="model">' +
      '<label  class="title title-color2">省侧业务处理成功率</label>' +
      '<div class="center">' +
      '<slider panels="panels"><slider/>' +
      '</div>' +
      '<core-loading ng-hide="coreLoading"></core-loading>' +
      '</div>',
      link: linkFn
    };

    function linkFn(scope) {
      scope.panels = [];

      angular.forEach(MODULES_ID.PROVINCE_BUS_SUCCESSRATE, function (id, key) {
        if (scope.selectedModules.indexOf(id) !== -1) {
          scope.panels.push(key.toLowerCase() + 'ProBusSuccessRate');
        }
      });

      scope.provinceBusSuccessrate = realtimeServer.proBusSuccessRate;
      scope.warn = {};
      realtimeServer.proBusSuccessRate.get(function () {
        angular.forEach(scope.provinceBusSuccessrate.data, function (rate, name) {
          if (scope.panels.indexOf(name + 'ProBusSuccessRate') === -1) {
            return;
          }
          scope.warn[name] = {
            bgColor: rate.rateState == 1 ? '#f44336' : '#2196f3',
            fontColor: rate.rate < 97 ? '#333' : '#fff'
          };
          var title;
          var id = name + 'ProBusSuccessRate';
          var ele = angular.element(document.getElementById(id));
          if (ele.find('canvas').length === 0) {
            title = BUSINESS_LINE_NAME[name.toUpperCase()];
            var html = $compile(
              '<aquarius fontcolor="warn[\'' + name + '\'].fontColor" scolor="warn[\'' + name + '\'].bgColor" percentage="provinceBusSuccessrate.data[\'' + name + '\'].rate" text="provinceBusSuccessrate.data[\'' + name + '\'].rate + \'%\'" width="100" height="100" style="border: 5px solid #DCDBDB;border-radius: 100px;"></aquarius><div>' + title + '</div>'
            )(scope);

            ele.append(html);
            scope.coreLoading = true;
          }
        });
      });

      scope.$watch('provinceBusSuccessrate.data', function(newValue, oldValue){
        if(newValue === oldValue){
          return;
        }

        angular.forEach(newValue, function(rate, name){
          if(scope.warn[name]){
            scope.warn[name].bgColor = rate.rateState == 1 ? '#f44336' : '#2196f3';
            scope.warn[name].fontColor = rate.rate < 97 ? '#333' : '#fff';
          }
        });
      }, true);

      timedTask.register('proBusSuccessRate');
    }
  }

  function provinceSysSuccessrate(realtimeServer, MODULES_ID, timedTask, $compile, BUSINESS_LINE_NAME) {
    return {
      restrict: 'E',
      replace: true,
      scope: {
        selectedModules: '='
      },
      template: '<div module-name="province-sys-successrate" layoutdom="1" draggable="true" class="model">' +
      '<label  class="title title-color2">省侧系统处理成功率</label>' +
      '<div class="center">' +
      '<slider panels="panels"><slider/>' +
      '</div>' +
      '<core-loading ng-hide="coreLoading"></core-loading>' +
      '</div>',
      link: linkFn
    };

    function linkFn(scope) {
      scope.panels = [];
      angular.forEach(MODULES_ID.PROVINCE_SYS_SUCCESSRATE, function (id, key) {
        if (scope.selectedModules.indexOf(id) !== -1) {
          scope.panels.push(key.toLowerCase() + 'ProSysSuccessRate');
        }
      });

      scope.provinceSysSuccessrate = realtimeServer.proSysSuccessRate;
      scope.warn = {};

      realtimeServer.proSysSuccessRate.get(function () {
        angular.forEach(scope.provinceSysSuccessrate.data, function (rate, name) {
          if (scope.panels.indexOf(name + 'ProSysSuccessRate') === -1) {
            return;
          }
          scope.warn[name] = {
            bgColor: rate.rateState == 1 ? '#f44336' : '#2196f3',
            fontColor: rate.rate < 97 ? '#333' : '#fff'
          };
          var title;
          var id = name + 'ProSysSuccessRate';
          var ele = angular.element(document.getElementById(id));
          if (ele.find('canvas').length === 0) {
            title = BUSINESS_LINE_NAME[name.toUpperCase()];
            var html = $compile(
              '<aquarius fontcolor="warn[\'' + name + '\'].fontColor" scolor="warn[\'' + name + '\'].bgColor" percentage="provinceSysSuccessrate.data[\'' + name + '\'].rate" text="provinceSysSuccessrate.data[\'' + name + '\'].rate + \'%\'" width="100" height="100" style="border: 5px solid #DCDBDB;border-radius: 100px;"></aquarius><div>' + title + '</div>'
            )(scope);
            ele.append(html);
          }
          scope.coreLoading = true;
        });
      });

      scope.$watch('provinceSysSuccessrate.data', function(newValue, oldValue){
        if(newValue === oldValue){
          return;
        }

        angular.forEach(newValue, function(rate, name){
          scope.warn[name].bgColor = rate.rateState == 1 ? '#f44336' : '#2196f3';
          scope.warn[name].fontColor = rate.rate < 97 ? '#333' : '#fff';
        });
      }, true);

      timedTask.register('proSysSuccessRate');
    }
  }

  function allBusSuccessrate(realtimeServer, MODULES_ID, timedTask, $compile, BUSINESS_LINE_NAME) {
    return {
      restrict: 'E',
      replace: true,
      scope: {
        selectedModules: '='
      },
      template: '<div module-name="all-bus-successrate" layoutdom="1" draggable="true" class="model">' +
      '<label  class="title title-color2">全业务流程业务处理成功率</label>' +
      '<div class="center">' +
      '<slider panels="panels"><slider/>' +
      '</div>' +
      '<core-loading ng-hide="coreLoading"></core-loading>' +
      '</div>',
      link: linkFn
    };

    function linkFn(scope) {
      scope.panels = [];
      angular.forEach(MODULES_ID.ALL_BUS_SUCCESSRATE, function (id, key) {
        if (scope.selectedModules.indexOf(id) !== -1) {
          scope.panels.push(key.toLowerCase() + 'AllBusSuccessRate');
        }
      });

      scope.allBusSuccessrate = realtimeServer.allBusSuccessRate;
      scope.warn = {};

      realtimeServer.allBusSuccessRate.get(function () {
        angular.forEach(scope.allBusSuccessrate.data, function (rate, name) {
          if (scope.panels.indexOf(name + 'AllBusSuccessRate') === -1) {
            return;
          }
          scope.warn[name] = {
            bgColor: rate.rateState == 1 ? '#f44336' : '#2196f3',
            fontColor: rate.rate < 97 ? '#333' : '#fff'
          };
          var title;
          var id = name + 'AllBusSuccessRate';
          var ele = angular.element(document.getElementById(id));
          if (ele.find('canvas').length === 0) {
            title = BUSINESS_LINE_NAME[name.toUpperCase()];
            var html = $compile(
              '<aquarius fontcolor="warn[\'' + name + '\'].fontColor" scolor="warn[\'' + name + '\'].bgColor" percentage="allBusSuccessrate.data[\'' + name + '\'].rate" text="allBusSuccessrate.data[\'' + name + '\'].rate + \'%\'" width="100" height="100" style="border: 5px solid #DCDBDB;border-radius: 100px;"></aquarius><div>' + title + '</div>'
            )(scope);
            ele.append(html);
          }
          scope.coreLoading = true;
        });
      });

      scope.$watch('allBusSuccessrate.data', function(newValue, oldValue){
        if(newValue === oldValue){
          return;
        }

        angular.forEach(newValue, function(rate, name){
          scope.warn[name].bgColor = rate.rateState == 1 ? '#f44336' : '#2196f3';
          scope.warn[name].fontColor = rate.rate < 97 ? '#333' : '#fff';
        });
      }, true);

      timedTask.register('allBusSuccessRate');
    }
  }

  function allSysSuccessrate(realtimeServer, MODULES_ID, timedTask, $compile, BUSINESS_LINE_NAME) {
    return {
      restrict: 'E',
      replace: true,
      scope: {
        selectedModules: '='
      },
      template: '<div module-name="all-sys-successrate" layoutdom="1" draggable="true" class="model">' +
      '<label  class="title title-color2">全业务流程系统处理成功率</label>' +
      '<div class="center">' +
      '<slider panels="panels"><slider/>' +
      '</div>' +
      '<core-loading ng-hide="coreLoading"></core-loading>' +
      '</div>',
      link: linkFn
    };

    function linkFn(scope) {
      scope.panels = [];
      angular.forEach(MODULES_ID.ALL_SYS_SUCCESSRATE, function (id, key) {
        if (scope.selectedModules.indexOf(id) !== -1) {
          scope.panels.push(key.toLowerCase() + 'AllSysSuccessRate');
        }
      });

      scope.allSysSuccessrate = realtimeServer.allSysSuccessRate;
      scope.warn = {};

      realtimeServer.allSysSuccessRate.get(function () {
        angular.forEach(scope.allSysSuccessrate.data, function (rate, name) {
          if (scope.panels.indexOf(name + 'AllSysSuccessRate') === -1) {
            return;
          }
          scope.warn[name] = {
            bgColor: rate.rateState == 1 ? '#f44336' : '#2196f3',
            fontColor: rate.rate < 97 ? '#333' : '#fff'
          };
          var title;
          var id = name + 'AllSysSuccessRate';
          var ele = angular.element(document.getElementById(id));
          if (ele.find('canvas').length === 0) {
            title = BUSINESS_LINE_NAME[name.toUpperCase()];
            var html = $compile(
              '<aquarius fontcolor="warn[\'' + name + '\'].fontColor" scolor="warn[\'' + name + '\'].bgColor" percentage="allSysSuccessrate.data[\'' + name + '\'].rate" text="allSysSuccessrate.data[\'' + name + '\'].rate + \'%\'" width="100" height="100" style="border: 5px solid #DCDBDB;border-radius: 100px;"></aquarius><div>' + title + '</div>'
            )(scope);
            ele.append(html);
          }
          scope.coreLoading = true;
        });
      });

      scope.$watch('allSysSuccessrate.data', function(newValue, oldValue){
        if(newValue === oldValue){
          return;
        }
        angular.forEach(newValue, function(rate, name){
          scope.warn[name].bgColor = rate.rateState == 1 ? '#f44336' : '#2196f3';
          scope.warn[name].fontColor = rate.rate < 97 ? '#333' : '#fff';
        });
      }, true);

      timedTask.register('allSysSuccessRate');
    }
  }

  function upayHealth(realtimeServer, chartService, timedTask) {
    return {
      restrict: 'E',
      replace: true,
      scope: {},
      template: '<div module-name="upay-health" layoutdom="1" draggable="true" class="model">' +
      '<label  class="title title-color2">统一支付系统健康度</label>' +
      '<div class="jk-title" ng-class="stateColor">' +
      '<div class="jk-one">{{state}}</div>' +
      '<div class="jk-two">{{upayHealth.data.sumHealth}}%</div>' +
      '</div>' +
      '<div class="center">' +
      '<div id="realTimeUpayHealth" style="width: 100%; height: 160px;"></div>' +
      '<core-loading ng-hide="coreLoading"></core-loading>' +
      '</div>' +
      '</div>',
      link: linkFn
    };

    function linkFn(scope) {
      var state = ['优', '良', '中', '差'];
      var stateColor = ['green', 'blue', 'yellow', 'red'];

      scope.upayHealth = realtimeServer.health;
      scope.state = '优';
      scope.stateColor = 'green';

      realtimeServer.health.get(function () {
        scope.state = state[scope.upayHealth.data.sumHealthState - 1];
        scope.stateColor = stateColor[scope.upayHealth.data.sumHealthState - 1];

        chartService.health.init(
          document.getElementById('realTimeUpayHealth'),
          scope.upayHealth.data
        );

        scope.$watch('upayHealth.data', function (newValue, oldValue) {
          if (newValue === oldValue) {
            return;
          }
          scope.state = state[scope.upayHealth.data.sumHealthState - 1];
          scope.stateColor = stateColor[scope.upayHealth.data.sumHealthState - 1];

          chartService.health.update(scope.upayHealth.data);
        }, true);

        scope.coreLoading = true;
      });

      timedTask.register('health');
    }
  }
})();